<template>
    <div>
        <div class="tips aui-ftn12 aui-text-cetner">如被商家投诉，将影响您申请试用，请严格按照流程完成每个试用</div>
        <div class="ts_cnt aui-bg-f">
            <div class="list" v-for="(item, index) in lists" :key="index">
                <div class="lt">
                    <div class="reason aui-ftn14 aui-padded-b-10" v-text="item.content"></div>
                    <div class="time aui-ftn12 aui-text-9" v-text="item.createtime"></div>
                </div>
                <!-- <img :src="item.image" alt="" @click="fnPreview(item.image)"> -->
            </div>
            <div v-if="lists.length == 0 && finished" v-cloak>
                <div class="no-data aui-text-center aui-text-9">
                    <i class="iconfont icon-lujing1161"></i>
                    <div class="aui-ftn16">
                        空空如也~
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import User from '@/service/user.js'
export default {
    data () {
        return {
            finished: false,
            lists: []
        }
    },
    mounted () {
        User.fnGetTsData({uid: this.$store.state.uid, isToken: true}).then(res => {
            if (res && res.status) {
                this.lists = res.data;
                this.finished = true;
            } else {
                this.finished = true;
            }
        })
    },
    methods: {
        // 预览图片
        fnPreview: function(path) {
            this.utils.fnPreviewPic([path])
        }
    }
}
</script>
<style>
    .tips {
        color: #ff2d31;
        background-color: #fff8ea;
        margin: 10px 0;
        height: 40px;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        align-items: center;
    }
    .ts_cnt {
        padding: 0 10px;
    }
    .ts_cnt .list {
        padding: 10px 0;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: space-between;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        -webkit-box-align: center;
        -webkit-align-items: center;
        align-items: center;
    }
    .ts_cnt .list .lt .reason {
        color: #333;
    }
    .ts_cnt .list img {
        width: 50px;
        height: 50px;
    }
</style>